<template>
	<view class="offer">
		<view class="part">
			<view class="partTit">
				报价信息
			</view>
			<view class="partVal">
				<view class="line dFlex jStart_aCenter">
					<text>承运吨数</text>
					<view class="val">
						{{ton}}吨
					</view>
				</view>
				<view class="line dFlex jStart_aCenter">
					<text>出价金额</text>
					<view class="val">
						<input type="number" v-model='shipInfo.ton_price' placeholder="请填写出价金额(每吨运费)"/>
					</view>
				</view>
			</view>
		</view>
		<view class="part">
			<view class="partTit">
				收款信息
			</view>
			<view class="partVal">
				<view class="line dFlex jStart_aCenter">
					<text>银行卡号</text>
					<view class="val">
						<input type="number" v-model='shipInfo.bank_number' placeholder="请填写银行卡号"/>
					</view>
				</view>
				<view class="line dFlex jStart_aCenter">
					<text>真实姓名</text>
					<view class="val">
						<input type="text" v-model='shipInfo.trueName' placeholder="请填写收款人姓名"/>
					</view>
				</view>
				<view class="line dFlex jStart_aCenter">
					<text>开户银行</text>
					<view class="val">
						<input type="text" v-model='shipInfo.bank_name' placeholder="请填写开户银行"/>
					</view>
				</view>
			</view>
		</view>
		<view class="btn" :style="{
			'bottom':isIos ? 'env(safe-area-inset-bottom)' : '0px'
		}" @click='subShipPrice'>确定报价</view>
	</view>
</template>

<script>
	import {
		addorder
	} from '@/tool/http.js';
	export default {
		data() {
			return {
				isIos:getApp().globalData.isIos,
				ton:'',
				shipInfo:{
					shipId:'',
					memberId:'',
					ton_price:'',
					bank_number:'',
					trueName:'',
					bank_name:'',
				}
			};
		},
		onLoad(e){
			if(e.id){
				this.shipInfo.shipId = e.id;
			}
			this.ton = e.ton ? e.ton : 0;
		},
		onShow(){
			this.shipInfo.memberId = uni.getStorageSync('uid');
			// this.shipInfo.memberId = 112;
		},
		methods:{
			//提交报价
			subShipPrice(){
				var tips = '';
				if(!this.shipInfo.ton_price){
					tips = '请输入每吨报价金额';
				}
				if(!this.shipInfo.trueName || !this.shipInfo.bank_number || !this.shipInfo.bank_name){
					tips = '请完善收款信息';
				}
				if(tips){
					uni.showToast({
						title:tips,
						icon:"none"
					})
					return
				}
				uni.showModal({
					title:'已确认报价信息无误？',
					success: async(op) => {
						if(op.confirm){
							let res = await addorder(this.shipInfo);
							if(res){
								uni.showToast({
									title:'报价信息已提交',
									icon:"success"
								})
								setTimeout(()=>{
									uni.navigateBack({
										delta:1
									})
								},1650)
							}
						}
					},
					fail:(err)=>{
						console.log(err);
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.offer{
		.btn{
			position: absolute;
			width: calc(100% - 24px);
			padding: 10px 0;
			border-radius: 4px;
			color:white;
			left:12px;
			text-align: center;
			background: #0087FC;
		}
		.part{
			.partVal{
				.line{
					width: 100%;
					font-size: 12px;
					line-height: 35px;
					color: #666666;
					.val{
						flex:1;
						margin-left: 8px;
					}
				}
				width: 100%;
				padding: 12px;
				background: white;
				border-radius: 4px;
				box-sizing: border-box;
			}
			.partTit{
				font-size: 12px;
				color: #555555;
				margin-bottom: 8px;
			}
			width: 100%;
			margin-bottom: 12px;
		}
		width: 100%;
		height: 100%;
		position: relative;
		padding: 12px;
		box-sizing: border-box;
	}
</style>
